{extend name="base" /}

{block name="content"}

<script src="__STATIC__/public/My97DatePicker/WdatePicker.js"></script>

<div class="g-main">

    <div class="m-main-title">

        <div class="m-container-fluid">

            <a href="{:url('index/welcome')}"><i class="icon icon-home"></i>首页</a>

            <span class="icon-angle-right"></span>

            <span>商城</span>

            <span class="icon-angle-right"></span>

            <span>订单管理</span>

            <span class="icon-angle-right"></span>

            <span>订单列表</span>

            <a class="u-flush"><i class="icon-repeat"></i></a>

        </div>

    </div>

    <div class="m-main-content">

        <div class="m-container">

            <table class="m-table">

                <tr>

                    <th>

                        <div class="m-options cf">

                            <div class="m-search fr">

                                <form action="" class="layui-form" id="searchForm">

                                    <label for="">订单状态</label>

                                    <div class="lay-select m-select-tiny">

                                        <select name="order_status_id">

                                            <option value="0"{if condition="$order_status_id eq 0"} selected{/if}>全部订单</option>

                                            <option value="1"{if condition="$order_status_id eq 1"} selected{/if}>已取消</option>

                                            <option value="2"{if condition="$order_status_id eq 2"} selected{/if}>未付款</option>

                                            <option value="3"{if condition="$order_status_id eq 3"} selected{/if}>已付款</option>

                                            <option value="4"{if condition="$order_status_id eq 4"} selected{/if}>待发货</option>

                                            <option value="5"{if condition="$order_status_id eq 5"} selected{/if}>等收货</option>

                                            <option value="6"{if condition="$order_status_id eq 6"} selected{/if}>已完成</option>

                                        </select>

                                    </div>
                                    <style>
                                        .xiadanhuiyuan{display: inline-block;position: relative}
                                        .xiadanhuiyuan-mask{    position: absolute;
                                            left: 70px;
                                            top: 26px;
                                            background: #fff;
                                            width: 211px;}
                                        .store{display: inline-block;position: relative}
                                        .store-mask{    position: absolute;
                                            left: 40px;
                                            top: 26px;
                                            background: #fff;
                                            width: 211px;}
                                    </style>
                                    <div class="xiadanhuiyuan">
                                        <label for="keywords">下单会员</label>

                                        <input type="text" name="keywords" id="keywords" class="u-ipt u-ipt-def" placeholder="请输入会员" value="{$keywords}" />
                                        <input type="hidden" name="member_id" id="member_id" class="u-ipt u-ipt-def" value="{$member_id}" />

                                        <ul class="xiadanhuiyuan-mask">
                                        </ul>
                                    </div>
                                    <div class="store">
                                        <label for="store">商户</label>

                                        <input type="text" name="store" id="store" class="u-ipt u-ipt-def" placeholder="请输入商户名称" value="{$store}" />
                                        <input type="hidden" name="store_id" id="store_id" class="u-ipt u-ipt-def" value="{$store_id}" />

                                        <ul class="store-mask">
                                        </ul>
                                        <label for="">下单时间</label>

                                        <input type="text" name="start_time" class="u-ipt u-ipt-small" placeholder="开始时间" value="{$startTime ?: ''}" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" readonly />

                                        <span>-</span>

                                        <input type="text" name="end_time" class="u-ipt u-ipt-small" placeholder="结束时间" value="{$endTime ?: ''}" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" readonly />

                                        <input type="submit" class="u-btn u-search" value="查看" />

                                        <input type="button" class="u-btn u-export" value="导出" />
                                    </div>
                                    <!--<label for="keywords">下单会员</label>-->

                                    <!--<input type="text" name="keywords" id="keywords" class="u-ipt u-ipt-def" placeholder="请输入要会员" value="{$keywords}" />-->




                                </form>

                            </div>

                        </div>

                    </th>

                </tr>

            </table>

            <form class="layui-form m-list-form">

                <table class="m-table mt-10">

                    <tbody class="datas">

                        <tr>

                            <th width="5%">ID</th>

                            <th width="10%">订单编号</th>

                            <th width="10%">下单会员</th>

                            <th width="10%">支付方式</th>

                            <th width="10%">收货人</th>

                            <th width="10%">订单金额</th>

                            <th width="10%">实付金额(实付金额:{$pay_amount})</th>

                            <th width="10%">下单时间</th>

                            <th width="15%">订单状态</th>

                            <th width="10%">操作(订单总数量:{$count})</th>

                        </tr>

                        {foreach name="data" item="v"}

                        <tr>

                            <td>{$v.id}</td>

                            <td>{$v.order_no}</td>

                            <td>{$v.username}</td>

                            <td>{$v.pay_type_name}</td>

                            <td>{$v.receiver_name}</td>

                            <td>{$v.order_amount}</td>

                            <td>{$v.pay_amount}</td>

                            <td>{$v.create_time_date}</td>

                            <td>{$v.order_status_txt}</td>

                            <td class="m-opt"><a style="display: none" data-id="{$v.id}" data-shipping-userid="{$v.shipping_userid}" data-shipping-user="{$v.shipping_user}" class="u-allot" title="分配订单"><i class="icon-user-md"></i></a><a href="{:url('add', ['id' => $v.id])}" title="查看详情"><i class="icon-pencil"></i></a></td>

                        </tr>

                        {/foreach}

                    </tbody>

                </table>

            </form>

            {include file="public:page" /}

        </div>

    </div>

</div>

{/block}

{block name="extrajs"}

{include file="laypage" /}

<script>
    $(function() {
        var $that = $(this);
        //输入框的值改变时触发
        $("#keywords").on("input", function (e) {
            //获取input输入的值
            console.log(e.delegateTarget.value);
            $.post('{:url("/manage/members/search")}', {nickname: $(this).val()}, function (ret) {
                if (ret) {

                    var html = '';

                    if (ret.status == 0) {

                        if (ret.data.length > 0) {

                            html += '<ul>';

                            for (var i = 0; i < ret.data.length; i++) {

                                html += '<li onclick="valueChange(' + ret.data[i].id + ')"><a class="u-nick-item" data-value="' + ret.data[i].id + '">' + ret.data[i].nickname + '</a></li>';

                            }

                            html += '</ul>';

                        } else {

                            html = '<h3>暂无搜索结果</h3>';

                        }

                    } else {

                        html = '<h3>暂无搜索结果</h3>';

                    }
                    $('.xiadanhuiyuan-mask').html(html)
                    $('.xiadanhuiyuan-mask').show()
                }
            }, 'JSON');
        });
    });
    function valueChange(id){
        $('#member_id').val(id)
    };


    $(function() {
        var $that = $(this);
        //输入框的值改变时触发
        $("#store").on("input", function (e) {
            //获取input输入的值
            console.log(e.delegateTarget.value);
            $.post('{:url("/manage/stores/search")}', {name: $(this).val()}, function (ret) {
                if (ret) {

                    var html = '';

                    if (ret.status == 0) {

                        if (ret.data.length > 0) {

                            html += '<ul>';

                            for (var i = 0; i < ret.data.length; i++) {

                                html += '<li onclick="storevalueChange(' + ret.data[i].id + ',\'' + ret.data[i].name + '\')"><a class="u-nick-item" data-userid="' + ret.data[i].id + '">' + ret.data[i].name + '</a></li>';

                            }

                            html += '</ul>';

                        } else {

                            html = '<h3>暂无搜索结果</h3>';

                        }

                    } else {

                        html = '<h3>暂无搜索结果</h3>';

                    }
                    $('.store-mask').html(html)
                    $('.store-mask').show()
                }
            }, 'JSON');
        });
    });
    function storevalueChange(id,value){
        $('#store_id').val(id)
    };


    $(function(){

        layui.use('layer', function(){

            $('.u-export').click(function(){

                $('#searchForm').attr('action', '{:url("export")}');

                $('#searchForm').submit();

            })

            

            $('.u-allot').click(function(){

                var id              = $(this).attr('data-id');

                var shipping_userid = $(this).attr('data-shipping-userid');

                var shipping_user   = $(this).attr('data-shipping-user');

                

                layer.open({

                    type: 1,

                    title: '指定配送员',

                    skin: 'layui-layer-rim', //加上边框

                    area: ['440px', '250px'], //宽高

                    content: '<div class="m-allot"><input type="text" name="nickname" class="u-ipt u-nick" placeholder="请输入配送员的昵称" value="'+shipping_user+'" /><input type="button" name="" class="u-btn" id="j_allot" data-id="'+id+'" data-userid="'+shipping_userid+'" value="确认提交" /><div class="m-user-list"></div></div>'

                });

            });


            

            $('body').on('keyup', '.u-nick', function(){

                var $that = $(this);

                $.post('{:url("/manage/members/search")}', {nickname: $(this).val()}, function(ret){

                    if (ret) {

                        var html = '';

                        if (ret.status == 0) {

                            if (ret.data.length > 0) {

                                html += '<ul>';

                                for (var i = 0; i < ret.data.length; i++) {

                                    html += '<li><a class="u-nick-item" data-userid="'+ret.data[i].id+'">'+ret.data[i].nickname+'</a></li>';

                                }

                                html += '</ul>';

                            } else {

                                html = '<h3>暂无搜索结果</h3>';

                            }

                        } else {

                            html = '<h3>暂无搜索结果</h3>';

                        }

                        $that.next().next().html(html);

                        $that.next().next().show();

                    }

                }, 'json');

            });

            

            $('body').on('click', '.u-nick-item', function(){

                $(this).parent().parent().parent().prev().attr('data-userid', $(this).attr('data-userid'));

                $(this).parent().parent().parent().prev().prev().val($(this).text());

                $(this).parent().parent().parent().hide();

            });

            

            $('body').on('click', '#j_allot', function(){

                var id     = $(this).attr('data-id');

                var userid = $(this).attr('data-userid');

                $.post('{:url("allot")}', {id: id, userid: userid}, function(ret){

                    if (ret.status == 0) {

                        dialog.success(ret.message, function(){

                            layer.closeAll();

                            window.location.reload();

                        });

                    } else {

                        dialog.error(ret.message);

                    }

                }, 'json');

            });

        })

    })

</script>

{/block}
